<template>
	<view class="page">
		<view class="item">
			<view class="title1">
				<view class="vertical-line"></view>申请类型
			</view>
			<view class="item-block">
				<text class="item-lable">贷款金额：</text>
				<picker @change="pickerMoney" :value="indexm" range-key="value" :range="moneyArr" class="item-input icon-down" style="margin-right:45upx;">   
					<view :class="[indexm==''?'item-default':' ']">{{moneyArr[indexm].value||"请选择"}}</view> 
				</picker>
			</view>
			<view class="item-block">
				<text class="item-lable">贷款类型：</text>
				<picker @change="pickerType" :value="indext" range-key="value" :range="typeArr" class="item-input icon-down" style="margin-right:45upx;">
					<view :class="[indext==''?'item-default':' ']">{{typeArr[indext].value||"请选择"}}</view>     
				</picker>  
			</view>
		</view>

		<view class="item">
			<view class="title1">
				<view class="vertical-line"></view>填写个人信息
			</view>
			<view class="item-block">
				<view class="item-lable">姓名</view>
				<input type="text" placeholder="请填写姓名" class="item-input" v-model="data.nickname">    
			</view>
			<view class="item-block">
				<text class="item-lable">身份证</text>
				<input type="number" placeholder="请填写身份证" class="item-input" v-model="data.identity">
			</view>
			<view class="item-block">
				<text class="item-lable">性别</text>
				<picker @change="pickerSex" :value="indexs" range-key="value" :range="sexArr" class="item-input icon-down" style="margin-right:45upx;">
					<view :class="[indexs==''?'item-default':' ']">{{sexArr[indexs].value||"请选择"}}</view>     
				</picker> 
			</view>
			<view class="item-block">
				<view class="item-lable">年龄</view>
				<input type="number" placeholder="请填写年龄" class="item-input" v-model="data.age">
			</view>
			<view class="item-block">
				<text class="item-lable">地址</text>
				<input type="text" placeholder="请填写地址" class="item-input" v-model="data.address">
			</view>
			<view class="item-block">
				<text class="item-lable">用途</text>
				<input type="text" placeholder="请填写用途" class="item-input" v-model="data.purpose">
			</view>
			<view class="item-block">
				<view class="item-lable">还款来源</view>
				<input type="text" placeholder="请填写还款来源" class="item-input" v-model="data.payment">
			</view>
			<view class="item-block">
				<text class="item-lable">手机</text>
				<input type="number" placeholder="请填写手机号码" class="item-input" v-model="data.phone">
			</view>
			<view class="item-block">
				<text class="item-lable">职业</text>
				<input type="text" placeholder="请填写职业" class="item-input" v-model="data.occupation">
			</view>
		</view>


		<view class="item">
			<view class="title1">
				<view class="vertical-line"></view>填写其他信息
			</view>
			<view class="item-block">
				<view class="item-lable">紧急联系人</view>
				<input type="text" placeholder="请填写紧急联系人" class="item-input" v-model="data.contact_name">
			</view>
			<view class="item-block">
				<text class="item-lable">联系人电话</text>
				<input type="number" placeholder="请填写联系电话" class="item-input" v-model="data.contact_phone">
			</view>
			<view class="item-block">
				<text class="item-lable">亲人</text>
				<input type="text" placeholder="请填写亲人姓名" class="item-input" v-model="data.relatives_name">      
			</view>
			<view class="item-block">
				<view class="item-lable">亲人电话</view>
				<input type="number" placeholder="请填写亲人电话" class="item-input" v-model="data.relatives_phone">
			</view>
			<view class="item-block">
				<text class="item-lable">同事</text>
				<input type="text" placeholder="请填写同事姓名" class="item-input" v-model="data.work_name">
			</view>
			<view class="item-block">
				<text class="item-lable">同事电话</text>
				<input type="number" placeholder="请填写同事电话" class="item-input" v-model="data.work_phone">
			</view>
			<view class="item-block">
				<view class="item-lable">单位名称</view>
				<input type="text" placeholder="请填写单位名称" class="item-input" v-model="data.company_name">
			</view>
			<view class="item-block">
				<text class="item-lable">单位电话</text>
				<input type="number" placeholder="请填写单位电话" class="item-input" v-model="data.company_phone">
			</view>
		</view>
		<button type="primary" class="btn" @click="save">立即提交</button>  
	</view>
</template>

<script>
	export default {
		data() {
			return {
				indexm: '',
				indext: '',
				indexs:'',
				moneyArr: [{id:1,value:'100万元'},
					{id:2,value:'200万元'},
					{id:3,value:'300万元'}],
				typeArr: [{id:1,value:'投资保证金'},
					{id:2,value:'投标保函'},
					{id:3,value:'愎约保函'},
					{id:4,value:'中标贷'},
					{id:5,value:'工程垫资'},
					{id:6,value:'抵押贷'},
					{id:7,value:'项目融资'},
					{id:8,value:'分期购'},
					{id:9,value:'信用贷'},
					{id:10,value:'车贷'},
					{id:11,value:'房贷'}],
				sexArr: [{id:1,value:'男'},
					{id:2,value:'女'}],
				data:{
					money:'',type:'',nickname:'',identity:'',sex:'',age:'',address:'',purpose:'',
					payment:'',phone:'',occupation:'',contact_name:'',contact_phone:'',relatives_name:'',
					relatives_phone:'',work_name:'',work_phone:'',company_name:'',company_phone:''
				}
			}
		},
		methods: {
			pickerMoney: function(e) {
				this.indexm = e.target.value; 
				this.data.money=this.moneyArr[e.target.value].id;
			},
			pickerType: function(e) {
				this.indext = e.target.value;
				this.data.type=this.typeArr[e.target.value].id;
			},
			pickerSex: function(e) {
				this.indexs = e.target.value;
				this.data.sex=this.sexArr[e.target.value].id;
			},
			save:function(){    
				var authData = uni.getStorageSync('authData');
				if (authData) {
					var Authorization = authData.auth;
					uni.showLoading({
						title: '提交中...'
					});
					if(this.data.money==''){
						uni.showToast({
							title: '请选择贷款金额',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.type==''){
						uni.showToast({
							title: '请选择贷款类型',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.nickname==''){
						uni.showToast({
							title: '请填写姓名',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.identity==''){
						uni.showToast({
							title: '请填写身份证号码',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.sex==''){
						uni.showToast({
							title: '请选择性别',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.age==''){
						uni.showToast({
							title: '请填写年龄',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.address==''){
						uni.showToast({
							title: '请填写地址',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.purpose==''){
						uni.showToast({
							title: '请填写用途',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.payment==''){
						uni.showToast({
							title: '请填写还款来源',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.phone==''){
						uni.showToast({
							title: '请填写手机号码',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.occupation==''){
						uni.showToast({
							title: '请填写职业',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.contact_name==''){
						uni.showToast({
							title: '请填写紧急联系人姓名',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.contact_phone==''){
						uni.showToast({
							title: '请填写紧急联系人电话',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.relatives_name==''){
						uni.showToast({
							title: '请填写情人姓名',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.relatives_phone==''){
						uni.showToast({
							title: '请填写亲人电话',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.work_name==''){
						uni.showToast({
							title: '请填写同事姓名',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.work_phone==''){
						uni.showToast({
							title: '请填同事电话',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.company_name==''){
						uni.showToast({
							title: '请填写公司名',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					if(this.data.company_phone==''){
						uni.showToast({
							title: '请填写公司电话',
							icon: 'none',
							duration: 2000
						});
						return false;
					}
					uni.request({
						url: this.baseUrl+"/finance/add",
						dataType: "json",
						data:this.data,
						header: {
							Authorization: Authorization
						},
						success: (res) => {
							uni.showToast({
								title: '提交成功',
								duration: 2000
							});
							uni.redirectTo({
								url: '../examine-ok/examine-ok'
							});
						},fail:()=>{
							uni.showToast({
								title: '提交失败',
								icon: 'none',
								duration: 2000
							});
						},
						complete:() => {
							uni.hideLoading();
						}
					})
				}else{
					uni.showToast({
						title: '请先登录',
						icon: 'none',
						duration: 2000
					});
					setTimeout(function() {
						uni.navigateTo({
							url: '/pages/login/login'
						});
					}, 2000); 
				}
			}
		}
	}
</script>

<style>
	page {
		background: #F3F3F3;
		font-size: 32upx;
	}

	.item {
		margin: 0 auto;
		margin-top: 25upx;
		padding: 0 15upx;
		width: 690upx;
		background: #FFFFFF;
		border-radius: 15upx;
	}

	.title1 {
		padding-top: 30upx;
		color: #328DF3;
		font-weight: bold;
		height: 32upx;
		line-height: 32upx;
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.vertical-line {
		width: 10upx;
		height: 32upx;
		background: #007AFF;
		border-radius: 5upx;
		margin-right: 15upx;
	}

	.item-block {
		display: flex;
		flex-direction: row;
		align-items: center;
		height: 100upx;
		line-height: 100upx;
		position: relative;
	}

	.item-block:after {
		position: absolute;
		right: 0;
		bottom: 0;
		left: 0;
		height: 1px;
		content: '';
		-webkit-transform: scaleY(.5);
		transform: scaleY(.5);
		background-color: #E7E7E7;
	}

	.item-lable {
		width: 200upx;
	}

	.item-input {
		flex: 1;
		text-align: right;
	}

	.item-default {
		color: #7A7A7A;
	}

	.icon-down:after {
		font-family: "iconfont" !important;
		content: "\e63b";
		font-size: 20px;
		position: absolute;
		color: #666666;
		top: 0;
		right: 0;
	}

	.btn {
		margin: 100upx auto;
		width: 630upx;
		height: 90upx;
		background: url(../../../static/images/btn-bg.png) no-repeat;
		background-size: 100% 100%;
		border-radius: 45upx;
		border: none;
	}
</style>
